<script setup>
import BasicSyntax from './components/BasicSyntax.vue';
import CompositionApi from './components/compositionApi.vue';
import denglu from './components/denglu.vue';
import parent from './components/parent.vue';
import chacao from './components/chacao.vue';
import router from './router';


</script>
<template>
  <!-- <BasicSyntax></BasicSyntax>
  <CompositionApi></CompositionApi> 
   <denglu></denglu>
   <parent></parent> 
     <chacao>
    要使用插槽就要引入该文件，用该文件名标签包裹要替换的内容
     要是用多个该文件标签就会多次重复替换内容 
    <p>
      替换内容
    </p> 
    <template v-slot:head>
       用具名插槽就必须用v-slot简写是#，要用template标签 
      <p>这是头部</p>
    </template>
    <template #foot>
      <p>这是脚部</p>
    </template>
  </chacao> -->
  <div>
    <ul>
      <li>
        <router-link to="/home">Home</router-link>
        <!-- 这是是通过设置一个链接，从而不需要在网页改地址，点击就可以自动切换 -->
    </li>
      <li>
        <router-link to="/About">About</router-link>
      </li>
      <li>
        <router-link to="/index">index</router-link>
      </li>
      
    </ul>
    
    <router-view></router-view>
    <!-- 路由的内容要用一个路由容器来接才能显示 -->
  </div>

</template>


